The Code Editor is for HTML email developers to write raw code. The ultimate result of this code is of course a high quality email, but it's also for generating templates that are exceptionally easy for non-developers to edit. It's a power tool based on a customized version of Code Mirror. This document outlines the general functionality.

The Code Editor can be opened for an existing template or by creating a new one. To do either, visit the Templates Manager Templates Manager. To create a new template in the code editor please click the "+" button at the top right of the Templates Manager. Or open an existing template by clicking the "Code" button.

• The Serious Email Code Editor is based on CodeMirror

  Code Mirror is powerful tool in it's own right. When combined with the output Window and various other customizations it becomes an HTML email developer's best friend. CodeMirror has many keyboard shortcuts built-in to make navigating and managing code a breeze from your keyboard. Visit: Code Editor keyboard short-cuts.

• Make Images or Text Editable in the Visual Editor

  By adding a data-see attribute to links, images, table rows, paragraphs, spans and more, you can make it so anyone can edit it. For more on creating editable templates, please see How to make HTML elements editable.

• Scale the View

  Use the slider bar to change the dimension of your output. This very handy for previewing responsiveness and what you can expect on mobile.

• Use JavaScript to Set-up Personalization

  Google V8 is baked into Serious Email. This means we process JavaScript server-side. This also means that rather than having to learn a proprietary language, you can use JavaScript to load-in personalization from your subscriber lists. For more on how to use JavaScript to personalize emails please click here: How to use JavaScript in your email.

• Validate Your Code

  Use the Validation Tool to scan your code for errors. The validation tool will help you identify problems fast.

• Formatting

  HTML emails tends to be shared and reused a lot. Use our formatting tool to keep it clean and organized. Note: Serious Email allows you to click on HTML elements in the output window and the Code window will go to the related line of code. This works most effectively when your code is formatted.

• Search & Replace

  Search & Replace can be accessed via the navigation or via short-cut: Shift+Ctrl+F (PC), Cmd+Alt+F (Mac). For more keyboard short-cuts visit: Code Editor keyboard short-cuts.

• Send Yourself (and/or Your Team) a Test

  Instantly send the email your working on by clicking the test button. If you haven't already, you can learn how to set up your test sends here: How to set up a test send.